import React, { Component } from 'react'
import axios from "axios";

import List from '../../components/List';

export class HomePage extends Component {
  constructor(props) {
    super(props)

    this.state = {
      list: [],
    }
  }

  componentDidMount() {
    axios.get("/list").then(res => {
      this.setState({
        list: res.data
      })
    })
  }
  render() {
    const { list } = this.state;
    console.log("首页", this);
    return (
      <div>
        <button onClick={() => {
          // ❤ 只存在view的文件中 ---所有的【页面】有路由，组件无路由，组件用withRouter
          // 1）直接跳转页面 【跳：this.props.history.push("/路径")】
          // 2）两个参数：1.路径 2.对象：是携带的参数state对象，对象内容可以是多个，state参数不会出现在浏览器导航栏里
          // 【跳：push("/路径",{})
          // this.props.history.push("/detail", {
          //   "name": "张三",
          //   age: 18,
          //   sex: true
          // }) 】
          //【 取：this.props.location.state【取整个对象】 】
          // 3）动态路由：直接在路由配置表对应的path路径加上/:id
          //【 跳：this.props.history.push("/detail/"+"123")】
          // 【取：this.props.match.params】



          this.props.history.push("/detail")

          // this.props.history.push("/detail", {
          //   "name": "张三",
          //   age: 18,
          //   sex: true
          // })
        }}>搜索</button>
        <List list={list}></List>
      </div >
    )
  }
}

export default HomePage